<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<!DOCTYPE html>
<html lang="en">
<head>
    <%@ include file="inc/meta.jsp" %>
    <meta charset="UTF-8">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta http-equiv="Access-Control-Allow-Origin" content="*">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">

    <%@ include file="inc/css.jsp" %>
    <%@ include file="inc/js.jsp" %>
    <%@ include file="inc/taglibs.jsp" %>
</head>
<body class="childrenBody">
<form class="layui-form" id="fileListForm">
    <blockquote class="layui-elem-quote quoteBox">
        <input type="hidden" id="groupId" value="${groupId}"/>
        <input type="hidden" id="groupLevel" value="${level}"/>
        <input type="hidden" id="groupName"/>
        <form class="layui-form">
            <div class="layui-inline">
                <div class="layui-input-inline">
                    <input type="text" class="layui-input searchVal" placeholder="请输入搜索的内容"/>
                </div>
                <a class="layui-btn search_btn" data-type="reload">搜索</a>
            </div>
            <c:if test="${sessionScope.allowUpload == 1}">
                <div class="layui-inline">
                    <a class="layui-btn layui-btn-normal addUser_btn">上传文件</a>
                </div>
            </c:if>
            <c:if test="${sessionScope.allowDelete == 1}">
                <div class="layui-inline">
                    <a class="layui-btn layui-btn-danger layui-btn-normal delAll_btn">批量删除</a>
                </div>
            </c:if>
            <c:if test="${sessionScope.session_master.id == 1}">
                <div class="layui-inline" id="addGroupDiv">
                    <a class="layui-btn layui-btn-normal addGroup_btn">添加分组</a>
                </div>
                <div class="layui-inline" id="updateGroupDiv" style="display: none;">
                    <a class="layui-btn layui-btn-normal updateGroup_btn">修改分组</a>
                </div>
                <div class="layui-inline" id="delGroupDiv" style="display: none;">
                    <a class="layui-btn layui-btn-danger delGroup_btn">删除分组</a>
                </div>
            </c:if>
        </form>
    </blockquote>
    <table id="fileList" lay-filter="fileList"></table>

    <!--操作-->
    <script type="text/html" id="fileListBar">
        <a class="layui-btn layui-btn-xs" lay-event="edit">下载</a>
        <c:if test="${sessionScope.allowDelete == 1}">
            <a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="del">删除</a>
        </c:if>
    </script>

    <a href="" download="" id="hiddenA" style="display: none">downloadFile</a>
</form>
</body>
</html>

<script>
    layui.use(['form', 'layer', 'table', 'upload'], function () {
        var layer = parent.layer === undefined ? layui.layer : top.layer,
            $ = layui.jquery,
            table = layui.table;

        var groupId = $('#groupId').val();
        var statusIndex = layer.load(1); //添加laoding,0-2两种方式

        //文件列表
        var tableIns = table.render({
            elem: '#fileList',
            url: 'backend/file/getData?groupId=' + groupId,
            cellMinWidth: 95,
            page: true,
            loading: true,
            height: "full-125",
            limits: [10, 15, 20, 25],
            limit: 10,
            id: "fileListTable",
            cols: [[
                {type: "checkbox", fixed: "left", width: 50},
                {field: 'name', title: '文件名', minWidth: 300, align: "center"},
                {field: 'uploadName', title: '上传人', width: 120, align: "center"},
                {field: 'createTime', title: '上传时间', align: 'center', width: 180},
                {title: '操作', width: 150, templet: '#fileListBar', fixed: "right", align: "center"}
            ]],
            done: function (res) {
                layer.close(statusIndex);
            }
        });

        //搜索【此功能需要后台配合，所以暂时没有动态效果演示】
        $(".search_btn").on("click", function () {
            table.reload("fileListTable", {
                page: {
                    curr: 1 //重新从第 1 页开始
                },
                where: {
                    keyWord: $(".searchVal").val(),  //搜索的关键字
                    groupId: $("#groupId").val()  //搜索的关键字
                }
            });
        });

        if (groupId === '0') {
            // 如果是父级节点，隐藏修改分组和删除分组按钮
            $('#addGroupDiv').css('display', '');
            $('#updateGroupDiv').css('display', 'none');
            $('#delGroupDiv').css('display', 'none');
        } else {
            if ($('#groupLevel').val() === '3') {
                $('#addGroupDiv').css('display', 'none');
            } else {
                $('#addGroupDiv').css('display', '');
            }
            $('#updateGroupDiv').css('display', '');
            $('#delGroupDiv').css('display', '');
        }

        //添加文件
        function addUser() {
            var index = layui.layer.open({
                title: "上传文件",
                type: 2,
                content: "backend/file/info",
                success: function (layero, index) {
                    var win = window[layero.find('iframe')[0]['name']]; //得到iframe页的窗口对象

                    var body = layui.layer.getChildFrame('body', index);
                    body.find("#groupId").val($('#groupId').val());
                    win.form.render();

                    setTimeout(function () {
                        layui.layer.tips('点击此处返回文件列表', '.layui-layer-setwin .layui-layer-close', {
                            tips: 3
                        });
                    }, 500)
                }
            });
            layui.layer.full(index);
            window.sessionStorage.setItem("index", index);
            //改变窗口大小时，重置弹窗的宽高，防止超出可视区域（如F12调出debug的操作）
            $(window).on("resize", function () {
                layui.layer.full(window.sessionStorage.getItem("index"));
            });
        }

        $(".addUser_btn").click(function () {
            var groupId = $('#groupId').val();

            if (null != groupId && groupId !== '0') {
                addUser();
            } else {
                layer.msg("请先点击左侧分组名选择文件分组");
            }
        });

        //批量删除
        $(".delAll_btn").click(function () {
            var checkStatus = table.checkStatus('fileListTable'),
                data = checkStatus.data,
                ids = '';
            if (data.length > 0) {
                for (var i in data) {
                    ids += data[i].id + ',';
                }
                layer.confirm('确定删除选中的文件？', {icon: 3, title: '提示信息'}, function (index) {
                    $.post("backend/file/batchDel", {
                        ids: ids
                    }, function (result) {
                        if (result === 1) {
                            layer.msg("批量删除文件成功");
                            tableIns.reload();
                            layer.close(index);
                        } else {
                            layer.msg("批量删除文件失败");
                        }
                    });
                })
            } else {
                layer.msg("请选择需要删除的文件");
            }
        });

        // 添加分组
        $(".addGroup_btn").click(function () {
            layer.prompt({title: '添加分组', formType: 3}, function (pass, index) {
                $.post("backend/master/saveGroup", {
                    name: pass,
                    parentId: groupId
                }, function (result) {
                    if (result === 1) {
                        layer.close(index);
                        layer.msg("添加成功");

                        top.location.reload();
                    } else if (result === -1) {
                        layer.msg("分组名重复，添加失败");
                    } else {
                        layer.msg("服务器错误，添加失败");
                    }
                });
            });
        });

        // 修改分组
        $(".updateGroup_btn").click(function () {
            $.post("backend/master/getGroup", {
                id: groupId
            }, function (result) {
                layer.prompt({title: '修改分组' + ' - ' + result.msg, formType: 3}, function (pass, index) {
                    $.post("backend/master/saveGroup", {
                        id: groupId,
                        name: pass
                    }, function (result) {
                        if (result === 1) {
                            layer.close(index);
                            layer.msg("添加成功");

                            top.location.reload();
                        } else if (result === -1) {
                            layer.msg("分组名重复，添加失败");
                        } else {
                            layer.msg("服务器错误，添加失败");
                        }
                    });
                });
            });
        });

        // 删除分组
        $(".delGroup_btn").click(function () {
            layer.confirm('确定删除此分组？该分组下的所有文件将一并删除', {icon: 3, title: '提示信息'}, function (index) {
                $.post("backend/master/deleteGroup", {
                    id: groupId
                }, function (result) {
                    if (result === 1) {
                        layer.close(index);
                        layer.msg("删除成功");
                        top.location.reload();
                    } else {
                        layer.msg("删除失败");
                    }
                });
            });
        });

        //列表操作
        table.on('tool(fileList)', function (obj) {
            var layEvent = obj.event,
                data = obj.data;
            if (layEvent === 'edit') { // 下载
                var a = document.createElement('a');
                a.href = data.url;
                a.download = data.name;
                a.click();
            } else if (layEvent === 'del') { //删除
                layer.confirm('确定删除此文件？', {icon: 3, title: '提示信息'}, function (index) {
                    $.post("backend/file/delete", {
                        id: data.id  //将需要删除的newsId作为参数传入
                    }, function (result) {
                        if (result === 1) {
                            layer.msg("删除成功");
                            tableIns.reload();
                            layer.close(index);
                        } else {
                            layer.msg("删除失败");
                        }
                    });
                });
            }
        });
    })
</script>